<h2>Product Management</h2>

{{assign var=prod_desc value=$product->get_description()}}
{{assign var=prod_images value=$product->get_images()}}
{{assign var=prod_dimension value=$product->get_dimensions()}}
{{assign var=prod_taxes value=$product->get_taxes()}}

<!--        Important MESG     
    *       First Record of Table product_extra_field_definitions must contain Prod_type
    *       Second Record of Table product_extra_field_definitions must contain is_healthy
    *       Spelling of Perishable, Non-Perishable, Non-Food Item, Non-Food Mail must be same in all places, ex: DB, Controller, .tpl file
-->
{{foreach from = $product_extra_fields item = product_extra_field name = outer1}}
    {{if $product_extra_field->field_id == 1 }}
        {{assign var=prod_type value=$product_extra_field->data}}
    {{/if}}
    {{if $product_extra_field->field_id == 2 }}
        {{assign var=isHealthy value = $product_extra_field->data}}
    {{/if}}
{{/foreach}}

<!--        Important MESG
    *       First Record of Table taxes must contain gst info
    *       Second Record of Table taxes must contain pst info
    *       If there is no record in Table products_tax_exemptions for a product, that means all kind of Taxes will be applicable for this Product
-->
{{foreach from = $prod_taxes item = prod_tax name = outer2}}
    {{if $prod_tax->tax_id == 1 }}
        {{assign var=gst value="true"}}
    {{/if}}
    {{if $prod_tax->tax_id == 2 }}
        {{assign var=pst value = "true"}}
    {{/if}}
{{/foreach}}
{{if !isset($gst) && !isset($pst) && $product->id!=""}}
    {{assign var=gst value="true"}}
    {{assign var=pst value = "true"}}
{{/if}}

<link href="{{$core_js}}/Dynatree/css/ui.dynatree.css" rel="stylesheet" type="text/css">
<link href="{{$core_js}}/prettyPhoto/css/prettyPhoto.css" rel="stylesheet" type="text/css">

<link href="{{$core_js}}/formValidation/css/cmxform.css" rel="stylesheet" type="text/css">
<!--
<link href="{{$core_js}}/formValidation/css/cmxformTemplate.css" rel="stylesheet" type="text/css">
<link href="{{$core_js}}/formValidation/css/core.css" rel="stylesheet" type="text/css">-->
<link href="{{$core_js}}/collapsiblePanel/ui.expandable.css" rel="stylesheet" type="text/css">

<script src="{{$core_js}}/Dynatree/ui.core.js" type="text/javascript"></script>
<script src="{{$core_js}}/Dynatree/jquery.dynatree.js" type="text/javascript"></script>
<script src="{{$core_js}}/prettyPhoto/jquery.prettyPhoto.js" type="text/javascript"></script>
<script src="{{$core_js}}/masking/autoNumeric-1.6.2.js" type="text/javascript"></script>
<script src="{{$core_js}}/masking/jquery.maskedinput-1.2.2.js" type="text/javascript"></script>
<script src="{{$core_js}}/formValidation/jquery.validate.js" type="text/javascript"></script>
<script src="{{$core_js}}/collapsiblePanel/ui.expandable.js" type="text/javascript"></script>

<script type='text/javascript'>
     var ajax_load = "<img src='{{$core_images}}/load.gif' alt='loading...' />";
     var objSelectedCat; // Hold Category Object from Category Tree
     var oTable;
     var prodId="{{$product->id}}";
     var action="{{$action}}";
    

     $(document).ready(function() {

                                 document.getElementById('prod_id').value = prodId;
                                 if(prodId != "")
                                     show_prod();

                                 // This is for validation
                                 $("#productForm").validate();


                                 //  This is for masking
                                 jQuery(function($) {
                                        $('input.auto').autoNumeric();
                                        $("#txtUPC").mask("999999999999");
                                     /*
                                        $("#phone").mask("(999) 999-9999");
                                        $("#tin").mask("99-9999999");
                                        $("#ssn").mask("999-99-9999");
                                     */
                                 });

                                //This is for PerttyPhoto
                                $("a[rel^='prettyPhoto']").prettyPhoto();

                                //This is for DataTable
                                oTable = $('#tbProdList').dataTable( {
                                            "sPaginationType": "full_numbers"
                                         } );

                                $("#btnCollapseAll").click(function(){
                                $("#tree").dynatree("getRoot").visit(function(dtnode){
                                    dtnode.expand(false);
                                });
                                return false;
                                });
                                $("#btnExpandAll").click(function(){
                                    $("#tree").dynatree("getRoot").visit(function(dtnode){
                                        dtnode.expand(true);
                                    });
                                    return false;
                                });

                                $("#tree").dynatree({
                                    onActivate: function(dtnode) {
                                                                    objSelectedCat = dtnode;
                                                                    var loadUrl = "{{$base_index_url}}/product/admin/add_edit_product/get_products";
                                                                    $.ajax({
                                                                                url: loadUrl,
                                                                                type: 'POST',
                                                                                async: false,
                                                                                cache: false,
                                                                                dataType: 'json',
                                                                                data:"is_ajax=true"+"&cat_id="+objSelectedCat.data.key,
                                                                                timeout: 1000,
                                                                                error: function(){
                                                                                    alert('Error loading XML document');
                                                                                },
                                                                                 beforeSend :function(){
                                                                                    $.blockUI("<h1>"+ajax_load+"</h1>");
                                                                                },
                                                                                success: function(data){
                                                                                    $("#container-1").expandable(); $("#open-close").animate({"opacity":1}, 1000).children().removeAttr("disabled");
                                                                                    $("#container-1").expandable("open");
                                                                                    document.getElementById('divCatDepth').innerHTML = "Current Category Path :  <font color='#66CC00'>"+data[0].Cat_path+"</font>";
                                                                                    oTable.fnClearTable();
                                                                                    $('#divProdList').show();
                                                                                    $('#divProdInfo').hide();
                                                                                    $('#selectedCatOperations').show();
                                                                                    prodId = "";
                                                                                    action = "";
                                                                                    for(var i=1;i<data.length;i++)
                                                                                        oTable.fnAddData([ data[i].ID,data[i].Name, data[i].Price, 
                                                                                                           data[i].Type,data[i].Tax, data[i].Cost, data[i].UPC,
                                                                                                           data[i].Action
                                                                                                         ]);
                                                                                },
                                                                                 complete :  function(data){
                                                                                    $.unblockUI();
                                                                                 }
                                                                            });


                                                                }
                                                   });
			        });

</script>

<script>
     function set_disabled_clean(id, disabled, clean)
     {
        if ( !document.getElementById || !document.getElementsByTagName)
            return;

        var nodesForAction = {button :'', input :'', optgroup :'', option :'', select :'', textarea :''};

        var node, nodes;
        var div = document.getElementById(id);
        if (!div)
            return;

        nodes = div.getElementsByTagName('*');
        if (!nodes)
            return;

        var i = nodes.length;
        while (i--)
        { 
            node = nodes[i];
            
            if ( node.nodeName && node.nodeName.toLowerCase() in nodesForAction )
            {
                node.disabled = disabled;
                if(clean==true)
                {
                    if(node.nodeName.toLowerCase() != "button")
                        node.value = '' ;
                    if(node.type == "checkbox")
                        node.checked = false ;
                }

                node.style.visibility = 'visible';
                if((node.nodeName.toLowerCase() == "button" || node.type == "file") && disabled)
                    node.style.visibility = 'hidden';
            }
        }

        // txtNNCDesc and txtMarkUP always be disabled
        //document.getElementById('txtNNCDesc').disabled = "disabled";
        document.getElementById('txtMarkUP').disabled = "disabled";
     }

     function show_prod()
     {
        $('#divProdInfo').show();
        document.getElementById('btnAdd').style.visibility = 'hidden';
        if('{{$action}}'=="view")
        {
            document.getElementById('btnEdit').style.visibility = 'hidden';
            set_disabled_clean("divProdInfo", true, false);
            document.getElementById('divUploadImage').style.visibility = 'hidden';
        }
      }

     

     function btnAddProd_click()
     {
        $("#container-1").expandable("close");
        $('#divProdInfo').show();
        set_disabled_clean("divProdInfo", false, true);
        document.getElementById('btnEdit').style.visibility = 'hidden';
        document.getElementById('divUploadImage').style.visibility = 'visible';
        document.getElementById('cat_id').value = objSelectedCat.data.key;
        document.getElementById('divCurrImage').innerHTML = "";
        document.getElementById('divCurrImage').style.visibility = 'hidden';
        //$("#container-1").expandable(); $("#open-close").animate({"opacity":1}, 1000).children().removeAttr("disabled");
        //$("#container-1").expandable("open");
        //$("#container-1").expandable(); $("#open-close").animate({"opacity":1}, 1000).children().removeAttr("disabled");
        //$("#container-1").expandable("destroy"); $("#open-close").animate({"opacity":0}, 1000).children().attr("disabled","disabled");
        //document.getElementById('btnEditProd').style.visibility = 'hidden';
     }

     function ddnNNCId_onchange(objDdnNNCId)
     {
        
        document.getElementById('txtNNCDesc').value = objDdnNNCId.options[objDdnNNCId.selectedIndex].text;
     }
     function cal_markup()
     {
        var price = document.getElementById('txtPrice').value;
        var cost = document.getElementById('txtCost').value;
        var markUP;

        if(price!="" && cost!="")
        {
            var markUP = (price-cost)/price;
            document.getElementById('txtMarkUP').value = markUP;
        }
     }
     function view_prod(prodId)
     {

     }

     function edit_prod(prodId)
     {

     }

     function delete_prod(prodId)
     {

     }
</script>


<!--        Main Table          Start       -->
<table width = "100%">
   <tr>
        <!--            Category Tree   Start       -->
        <td width = "20%" valign="top" align="left">
            <table width = "95%">
                <tr>
                    <td>
                        <p>
                            <b>
                            <a href="#" id="btnExpandAll">Expand Tree</a> |
                            <a href="#" id="btnCollapseAll">Collapse Tree</a>
                            </b>
                        </p>
                    </td>
                </tr>
                <tr><td><div id="tree">{{$tree}}</div></td></tr>
            </table>
        </td>
        <!--            Category Tree   End       -->
        <td style="border-left: 1px solid cyan; padding: 5px;">
        <!--            Right most portions(Products List Table, Product Attributes) of this Page           Start       -->
        <td width = "80%">
            <table width = "100%">
               <tr>
                     <td>
                        <div id="selectedCatOperations" style="display: none;">
                            <table width = "100%">
                                 <tr>
                                     <td colspan=3 align="center">
                                         <fieldset style="color:black; font-size: 14px; background-color:#FFFFCC">
                                            <div id = "divCatDepth"></div>
                                         </fieldset>
                                     </td>
                                 </tr>
                                 <tr>
                                     <td align="right" width = "100%"><button id="btnAddProd" name="btnAddProd" onclick = "btnAddProd_click();">Add Product</button></td>
                                 </tr>
                                 
                            </table>
                        </div>
                    </td>
              </tr>
              <!--          Table for Product List          Start           -->
              <tr>
                  <td>
                       <div id="container-1" style="display: none;">
                                <div class="ui-expandable-title">Expand/Collapse Product List</div>
                                <div id="divProdList">
                                    <table cellpadding="0" cellspacing="0" border="0" class="display" id="tbProdList" width = "100%">
                                        <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>Name</th>
                                                <th>Price</th>
                                                <th>Type</th>
                                                <th>Tax</th>
                                                <th>Cost</th>
                                                <th>UPC</th>
                                                <th>Action</th>
                                           </tr>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                              </div>
                        </div>
                  </td>
                </tr>
                <!--          Table for Product List          End           -->
                <!--          Product Attributes              Start         -->
                <tr>
                    <td>
                        <div id="divProdInfo" style="display: none;">
                           <table width = "100%" >
                              <tr>
                                <td colspan=3>
                                  <form  name= "productForm" id="productForm" enctype="multipart/form-data" method="post" action="http://127.0.0.1:8080/ngbdcart/index.php/product/admin/add_edit_product/save_product">
                                     <div id="tabs">
                                         <ul>
                                          <li><a href="#tabs-1">General Information</a></li>
                                         </ul>
                                         <br>
                                         <div id="tabs-1">
                                             <!--          Product Attributes       Main Table       Start         -->
                                             <table width="100%" >
                                                <tr>
                                                    <td align="center" width="70%">
                                                      <table width="90%">
                                                            <tr>

                                                                <td align="right" width="20%">POS Description: <font color='red'>*</font></td>
                                                                <td><input type="text" name="txtName" id = "txtName" size="50" class="required" value="{{if $product->id <> ""}} {{$prod_desc->short_desc}}{{/if}}"/></td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%">Price: <font color='red'>*</font></td>
                                                                <td><input type="text" name="txtPrice"  id="txtPrice" class="auto required" size="50" value="{{$product->price}}" onchange="cal_markup();"/></td>
                                                            </tr>
                                                             <tr>
                                                                <td align="right" width="20%">Cost: <font color='red'>*</font></td>
                                                                <td><input type="text" name="txtCost" id = "txtCost" class="auto required" size="50" value="{{$product->cost}}" onchange="cal_markup();"/></td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%">Mark UP %:</td>
                                                                <td><input type="text" name="txtMarkUP" id = "txtMarkUP" size="50" ></td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%">Weight: <font color='red'>*</font></td>
                                                                <td><input type="text" name="txtWeight" id = "txtWeight" class="auto required" size="50" value="{{$prod_dimension->weight}}" /></td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td align="left">
                                                                    <fieldset class="fieldset" >
                                                                    <legend><b>Level</b></legend>
                                                                    <table width="100%">
                                                                        <tr>
                                                                            <th>&nbsp;</th>
                                                                            <th>Level 1</th>
                                                                            <th>Level 2</th>
                                                                            <th>Level 3</th>
                                                                        </tr>
                                                                        <tr>
                                                                            <td>Manitoba <font color='red'>*</font></td>
                                                                            <td><input type="radio" id="mb_level"  name="mb_level" value="1" class="required"></td>
                                                                            <td><input type="radio" id="mb_level"  name="mb_level" value="2"></td>
                                                                            <td><input type="radio" id="mb_level"  name="mb_level" value="3"></td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td><label for="mb_level" class="error" style="display: none;">Please select a Level for Manitoba</label></td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td>Nunavut <font color='red'>*</font></td>
                                                                            <td><input type="radio" id="nu_level" name="nu_level" value="1" class="required"></td>
                                                                            <td><input type="radio" id="nu_level" name="nu_level" value="2"></td>
                                                                            <td><input type="radio" id="nu_level" name="nu_level" value="3"></td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td><label for="nu_level" class="error" style="display: none;">Please select a Level for Nunavut</label></td>
                                                                        </tr>
                                                                    </table>
                                                                    </fieldset>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td >
                                                                    <fieldset class="fieldset">
                                                                    <legend><b>Tax <font color='red'>*</font></b></legend>
                                                                        <table width="100%">
                                                                            <tr>
                                                                                <td>
                                                                                    <input type="checkbox" class="checkbox required" name="tax[]" id="chkPst" value="pst" {{if isset($pst) }} {{if $pst == "true" }}checked {{/if}} {{/if}}> PST
                                                                                </td>
                                                                                <td>
                                                                                    <input type="checkbox" class="checkbox" name="tax[]" id="chkGst" value="gst" {{if isset($gst) }} {{if $gst == "true" }}checked {{/if}} {{/if}}> GST
                                                                                </td>
                                                                            </tr>
                                                                            <tr>
                                                                                <td><label for="tax[]" class="error" style="display: none;">Please select at least 1 Tax</label></td>
                                                                            </tr>
                                                                        </table>
                                                                    </fieldset>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%"></td>
                                                                <td><input type="checkbox" name="chkHealthyChoice" id="chkHealthyChoice" value="true" {{if isset($isHealthy) }} {{if $isHealthy == "true" }}checked {{/if}} {{/if}}> Healthy Choice ?</td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%"></td>
                                                                <td><input type="checkbox" name="chkOnSale" id="chkOnSale" value="true" {{if isset($onSale) }} {{if $onSale == "true" }}checked {{/if}} {{/if}}> On Sale ?</td>
                                                            </tr>

                                                            <tr>
                                                                <td align="right" width="20%">UPC: <font color='red'>*</font></td>
                                                                <td><input type="text" name="txtUPC" id = "txtUPC" size="50" class="required" value="{{$product->upc}}"/></td>
                                                            </tr>
                                                            <tr>
                                                                <td align="right" width="20%">Info: <font color='red'>*</font></td>
                                                                <td><textarea rows="2" cols="48" name="txtInfo" id = "txtInfo" class="required">{{if $product->id <> ""}} {{$prod_desc->long_desc}}{{/if}}</textarea> </td>
                                                            </tr>
                                                        </table>

                                                     </td>
                                                     <td valign="top" align="center" width="30%">
                                                         <Table width="100%">
                                                              <tr>
                                                                 <td>
                                                                     <div id = "divNNC">
                                                                        <fieldset class="fieldset">
                                                                        <legend><b>NNC Item</b></legend>
                                                                        <table>
                                                                             <tr>
                                                                                <td align="right" width="20%">ID: <font color='red'>*</font></td>
                                                                                <td>
                                                                                    <select id="ddnNNCId" name="ddnNNCId" onchange="ddnNNCId_onchange(this)">
                                                                                        <option value="">Select ID</option>
                                                                                        {{foreach from = $nncis item = nnci name = outer}}
                                                                                                <option value="{{$nnci->id}}">{{$nnci->nnc_id}}</option>
                                                                                        {{/foreach}}
                                                                                    </select>
                                                                                </td>
                                                                            </tr>
                                                                            <tr>
                                                                                <td align="right" width="20%">Description:</td>
                                                                                <td><textarea rows="2" cols="40" name="txtNNCDesc" id = "txtNNCDesc" class="required">{{if $product->id <> ""}} {{$prod_desc->long_desc}}{{/if}}</textarea> </td>
                                                                            </tr>
                                                                            <tr>
                                                                                <td align="right" width="20%"></td>
                                                                                <td><label for="txtNNCDesc" class="error" style="display: none;">Please select NNC Item ID</label></td>
                                                                            </tr>
                                                                        </table>
                                                                        </fieldset>
                                                                     </div>
                                                                 </td>
                                                             </tr>
                                                             
                                                             <tr>
                                                                 <td>
                                                                     <div id = "divImage">
                                                                        <fieldset class="fieldset">
                                                                        <legend><b>Image</b></legend>
                                                                            <div id = "divCurrImage">
                                                                                <fieldset class="fieldset">
                                                                                <legend><b>Current Images</b></legend>
                                                                                <ul class="gallery clearfix">
                                                                                    <table>
                                                                                        {{foreach from = $prod_images item = prod_image name = outer}}
                                                                                            <tr>
                                                                                                <td>
                                                                                                    <a href="{{$product_images}}/{{$prod_image->file_name}}" rel="prettyPhoto[pp_gal]" title="You can add caption to pictures."><img src="{{$product_images}}/{{$prod_image->thumbnail_name}}" width="60" height="60" alt="" /></a>
                                                                                                </td>
                                                                                                <td>
                                                                                                    {{if $action=="edit"}}
                                                                                                        <input type="checkbox" name="chkProdImagesDeleted[]" value="{{$prod_image->id}}" > Delete ?
                                                                                                     {{/if}}
                                                                                                </td>
                                                                                            </tr>
                                                                                        {{/foreach}}
                                                                                    </table>
                                                                                </ul>
                                                                                </fieldset>
                                                                             </div>
                                                                              <div id = "divUploadImage">
                                                                                 <fieldset class="fieldset">
                                                                                 <legend><b>Upload Images</b></legend>
                                                                                 <table width="100%">
                                                                                     <tr><td align="right"><input type="file" name="prod_image1" id="prod_image1"/></td></tr>
                                                                                     <tr><td align="right"><input type="file" name="prod_image2" id="prod_image2"/></td></tr>
                                                                                     <tr><td align="right"><input type="file" name="prod_image3" id="prod_image3"/></td></tr>
                                                                                 </table>
                                                                                 </fieldset>
                                                                             </div>
                                                                        </fieldset>
                                                                     </div>
                                                                  </td>
                                                             </tr>
                                                        </Table>
                                                     </td>
                                                 </tr>
                                            </table>
                                            <!--          Product Attributes       Main Table       End         -->
                                            <input type="hidden" id = "cat_id" name="cat_id" value = ""/>
                                            <input type="hidden" id = "prod_id" name="prod_id" value = "">
                                                
                                         </div>

                                         <center>
                                             <button class="submit" type="submit"  name="btnAdd" id="btnAdd">Add</button>
                                             <button class="submit" type="submit"  name="btnEdit" id="btnEdit">Edit </button>
                                             
                                             <!--
                                             <button id="btnEditProd" name="btnEditProd" onclick = "save_prod();">Edit</button>
                                             <button id="btnSaveProd" name="btnSaveProd" onclick = "save_prod();">Save</button>
                                             -->
                                         </center>
                                     </div>
                                  </form>
                                </td>
                            </tr>
                           </table>
                        </div>
                    </td>
                </tr>
                <!--          Product Attributes              End         -->
                <tr><td>&nbsp;</td></tr>
                <tr><td>&nbsp;</td></tr>

          </table>
       </td>
       <!--            Right most portions(Products List Table, Product Attributes) of this Page           End       -->
    </tr>
</table>
<!--        Main Table          End       -->

    




